<template>
	<view class="box">
		<!-- #ifdef MP-WEIXIN -->
		<view class="head"
			:style="'padding-top:'+statusBarHeight1+'px;padding-right:'+ (WXwidth + 15) +'px;height:' + (statusBarHeight1 + 44) + 'px'">
			<!-- #endif -->
			<!-- #ifndef MP-WEIXIN -->
			<view class="head"
				:style="'padding-top:'+(statusBarHeight1+10)+'px;height:' + (statusBarHeight1 + 54) + 'px'">
				<!-- #endif -->
				<view style="width: 124rpx;">
					<image class="fanhui" @click="fanhui" src="https://pic.bangbangtongcheng.com/static/fanhui_bai.png"
						mode=""></image>
				</view>
				<view style="font-size: 36rpx;font-size: 500;">
					地址管理
				</view>
				<view class="manage" @click="manage()">
					{{text}}
				</view>
			</view>
			<!-- #ifdef MP-WEIXIN -->
			<view :style="'padding-top:'+statusBarHeight1+'px;height:' + (statusBarHeight1 + 44) + 'px'"></view>
			<!-- #endif -->
			<!-- #ifndef MP-WEIXIN -->
			<view :style="'padding-top:'+statusBarHeight1+'px;height:' + (statusBarHeight1 + 54) + 'px'"></view>
			<!-- #endif -->
			<view class="center">
				<view class="item" v-for="(item,index) in addressList" v-if="addressList.length" :key="item.id">
					<view style="display: flex;align-items: center;">
						
						<view class="">
							<view class="title">
								{{item.region}}{{item.detailedAddress || ''}}
							</view>
							<view class="contactInformation">
								<span class="name">{{item.consignee}}</span>
								<span class="phone">{{item.phoneNumber}}</span>
							</view>
						</view>
					</view>
					<view class="item_bottom" v-if="text == '完成'">
						<!-- <view class="mor" style="margin-right: 20rpx;" v-if="text == '完成'">
						</view> -->
						<view class="mor">
							<radio style="transform:scale(0.8)" @click="radioChange(item)" color="#64B6A8"  :checked="item.whetherDefault==1"/>
							<!-- <radio style="transform:scale(0.8)" @click="radioChange(item)" color="#64B6A8" :checked="item.whetherDefault==1"/> -->
							<span style="margin-left: 70rpx;" v-show="item.whetherDefault == 1">默认</span>
						</view>
						<view class="del" @click="del(item)">
							删除
						</view>
					</view>
				</view>
				<view v-if="addressList.length == 0" class="none">
					<image src="https://pic.bangbangtongcheng.com/static/none.png" mode="widthFix" />
					<view>暂无收货地址</view>
				</view>
			</view>
			<view class="footer">
				<view class="btn" @click="addAddress()">
					添加收货地址
				</view>
			</view>
			<uniBall></uniBall>
		</view>
</template>
<script>
	import permision from "@/js_sdk/wa-permission/permission.js"
	//#ifdef H5
	import wxshare from "@/utils/index.js";
	//#endif
	import {
		mapGetters
	} from "vuex";
	export default {
		data() {
			return {
				userInfo: uni.getStorageSync("Pduser"),
				WXwidth: "",
				text:'管理',
				value:'',
				addressList:[],
				addressInfo:null
			};
		},
		onLoad(options) {
			var than = this;
			// #ifdef MP-WEIXIN
			// 获取胶囊信息
			let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
			let getWindowInfo = uni.getWindowInfo().screenWidth
			this.WXwidth = getWindowInfo - (menuButtonInfo.right - menuButtonInfo.width)
			// #endif
			/* #ifdef H5 */
			this.jinzhi();
			/* #endif */
		},
		onShow() {
			this.shippAddressList()
		},
		methods: {
			// 获取收货地址列表
			shippAddressList(){
				// this.addressList= []
				// this.addressList=[]
				this.$myRequest.get("/api/mobile/public/getMyHarvestAddressTabulation",{
					userId:this.userInfo.id
				}).then(res => {
					this.addressList = res.harvestAddressTabulation
				})
			},
			del(item){
				let that = this
				uni.showModal({
					title: "",
					content: "确定删除此地址吗？",
					showCancel: true,
					success: (res) => {
						if (res.confirm) {
							that.$myRequest.post("/api/mobile/public/deleteHarvestAddress", {
								ids: item.id,
							}).then((res) => {
								uni.showToast({
									title: res.msg,
									icon: "none",
									mask: true,
								});
								setTimeout(() => {
									this.shippAddressList()
								}, 1000);
							});
						}
					},
				});
			},
			radioChange(item){
				this.addressList = this.addressList.map(val=>{
					if(item.id == val.id){
						return{
							...val,
							whetherDefault:1
						}
					}
					return{
						...val,
						whetherDefault:0
					}
				})
				// item.whetherDefault=1
				this.addressInfo = item
			},
			manage(){
				if(this.text=="管理"){
					this.text='完成'
				}else{
					this.text='管理'
				 if	(this.addressInfo == null)  return
					
					this.$myRequest.post("/api/mobile/public/setDefaultHarvestAddress",{
						userId:this.userInfo.id,
						id:this.addressInfo.id
					}).then(res => {
						uni.showToast({
							title: res.msg,
							icon: "none",
							mask: true,
						});
						this.shippAddressList()
					})
				}
			},
			addAddress(){
				uni.navigateTo({
					url: '/pages_my/addShippAddress'
				});
			},
			jinzhi() {
				let _this = this;
				let param = window.location.href.split("#")[0];
				uni.request({
					method: "post",
					data: {
						url: param
					},
					header: {
						"content-type": "application/x-www-form-urlencoded"
					},
					url: "https://www.bangbangtongcheng.com/conven//mob/login/getJsTicket.do",
					success(re) {
						_this.jinzhifx(re.data);
					}
				});
			},
			jinzhifx(data) {
				wxshare.config({
					debug: false, //是否打开调试
					appId: data.appId, // 公众号的唯一标识
					timestamp: data.timestamp, // 生成签名的时间戳
					nonceStr: data.nonce, // ，生成签名的随机串
					signature: data.signature, // 签名
					jsApiList: ["hideMenuItems"]
				});
				// 禁止分享
				wxshare.hideMenuItems({
					// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
					menuList: [
						"menuItem:share:appMessage",
						"menuItem:share:timeline",
						"menuItem:share:timeline",
						"menuItem:share:qq",
						"menuItem:favorite",
						"menuItem:share:QZone",
						"menuItem:openWithSafari"
					]
				});
			},
			fanhui() {
				uni.navigateBack({
					delta: 1
				});
			},
		},
		computed: {
			...mapGetters(["userid", "islogin", "statusBarHeight1", "userinfo"])
		}
	};
</script>
<style lang="less" scoped>
	.box {
		width: 100%;
		min-height: 100vh;
		background-color: #fff;
	}

	.head {
		position: fixed;
		top: 0;
		left: 0;
		width: 750rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 15px;
		background-color: #64B6A8;
		z-index: 1000;
		color: #fff;

		.fanhui {
			width: 40rpx;
			height: 40rpx;
		}
		.manage{
			width: 124rpx;
			height: 48rpx;
			border-radius: 6rpx;
			border: 1px solid #FFFFFF;
			font-size: 26rpx;
			font-weight: 400;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}

	.center{
		.item{
			padding:20rpx 30rpx 20rpx 40rpx ;
			border-bottom: 1px solid #E0E0E0;
			.title{
				font-size: 30rpx;
				font-weight: 550;
				color: #333333;
				margin-bottom: 12rpx;
			}
			.contactInformation{
				display: flex;
				align-items: center;
				font-size: 30rpx;
				font-weight: 400;
				margin-bottom: 12rpx;
				.name{
					color: #333333;
					margin-right: 20rpx;
				}
				.phone{
					color: #999999;
				}
			}
			.item_bottom{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.mor{
					font-size: 26rpx;
					font-weight: 400;
					color: #333333;
					display: flex;
					align-items: center;
				}
				.del{
					width: 124rpx;
					height: 48rpx;
					border-radius: 6rpx;
					border: 1px solid #333333;
					font-size: 26rpx;
					font-weight: 400;
					color: #333333;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
		}
	}
	.footer{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 120rpx;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		.btn{
			width: 670rpx;
			height: 80rpx;
			background-color: #64B6A8;
			border-radius: 50rpx;
			font-size: 34rpx;
			font-weight: 400;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
	.none {
		text-align: center;
	
		image {
			width: 430rpx;
			margin-bottom: 16rpx;
		}
	
		view {
			height: 40rpx;
			line-height: 40rpx;
			color: #666;
		}
	}
</style>
